/**
 * @description  : 通知公告-附件展示组件
 * @descriptionDetail : 通知公告-附件展示组件
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-12-05 15:48:33
 */
<template>
  <view class="page">
    <view class="main-content" v-for="(item,index) in fileList" :key="index">
      <u-row>
        <u-col :span="1.2" style="text-align:right;">
          <u-icon name="attach" width="42" height="48" color="#2979ff" size="34"></u-icon>
        </u-col>
        <u-col :span="6.8">
          {{ item.name }}
        </u-col>
        <u-col :span="3" style="text-align:right;color:#3381ff">
          <span @click="upload(item)">点击下载</span>
        </u-col>
        <u-col :span="1">
          <u-icon name="download" color="#2979ff" size="30" @click="upload(item)"></u-icon>
        </u-col>
      </u-row>
    </view>
  </view>
</template>

<script>
import certificateService from "@/service/certificate/certificate.service.js";
import queryService from "@/service/check/query.service"
const IMG_LIST = ['image/gif', 'image/jpg', 'image/jpeg', 'image/bmp', 'image/png',];
export default{
  props:['noticeUuid',],
  data(){
    return {
      fileList:[],
      picTypeList: IMG_LIST, // 图片类型集合
    };
  },
  created(){
    this.init();
  },
  methods:{
    init(){
      certificateService.goFiles(this.noticeUuid, "").then(res => {
        this.picList = res.data;
        this.fileList = this.picList.map((f) => {
          f.uid = f.fileId = f.gfiId;
          f.name = f.gfiAlis + (this.showUploader ? `（${f.gfiUser}）` : '');
          f.status = 'done';
          f.size = f.gfiSize;
          f.url = queryService.previewImg(f.gfiId);
          if (this.picTypeList.join(',').indexOf(f.gfiSuffix) != -1) {
            f.type = 'image/' + f.gfiSuffix;
          }
          return f;
        });
        console.log(this.fileList);
      })
    },
    upload(item){
      this.$modal.downloadFile(item.url,item.name);
    },
  },
}
</script>

<style scoped lang="scss">
	.page{
    background-color: #f2f2f3;
    padding: 8rpx 8rpx 0rpx 8rpx;
    margin: 30rpx 0;
    width: 100%;
  }
  .main-content{
    padding: 20rpx 0 20rpx 0;
    border-bottom: 2rpx solid $u-border-color;
  }
  .main-content:last-child{
    padding: 20rpx 0 20rpx 0;
  }
</style>